import React , {useEffect, useState} from "react";
import "./index.scss";
import Header from "./header";
import Left from "./left";
import Right from "./right";


const Home = () => {
  // 缩放比列
  const [scale,setScale] = useState(1);
  const resize = () => {
    setScale(document.documentElement.offsetWidth / 1920);
  }
  useEffect( () => {
    
      window.addEventListener("resize",resize);
      resize();

      return () => {
         window.removeEventListener("resize",resize);
      }
  },[])
  return (
    
    // style={{minHeight: 1080 * scale}}
    <div className="xie-home" >
      <div className="home-container" style={{transform: `scale(${scale},${scale})`}}>
          <div className="header">
              <Header></Header>
          </div>
          <div className="container">
              <div className="left">
                  <Left></Left>
              </div>
              <div className="right">
                <Right></Right>
              </div>
          </div>
      </div>
    </div>
  );
};
export default Home;
